import React from 'react'
import { Panel, PanelHeader, PanelBody } from 'react-weui'
import Item from '../home/ColumnItem'
import { connectSort } from '../../container/sort/connectSort'

class SortProduct extends React.Component {
	constructor(props) {
		super(props)
        this.state = {
            sortName: ''
        }
	}
  componentDidMount() {
    this.props.sortActions.fetchGoodsFromData(this.props.params.sortId);
    // const that = this;
    this.props.sortActions.fetchSort(this.props.params.storeId);
    // setTimeout(function() {
    //     const goodsData = that.props.sort.goodsData;
    
    //     const data = JSON.stringify(goodsData);
    //     alert(data);
    // }, 3000)
  }
  componentWillReceiveProps(nextProps) {
    if(nextProps.sort.sortsFetched && nextProps.sort.goodsFetched) {
        const goodData = nextProps.sort.goodsData[0];
        const sortName = nextProps.sort.sortsData.filter(item => item.classId==goodData.classId)[0].get_class_detail.name;
        this.setState({ sortName })
    }
  }
	render() {
        const { goodsData, sortsData } = this.props.sort;
		return (
		    <Panel>
           		<PanelHeader style={{
           			fontSize: '1em',
           			textAlign: 'center',
           			background: 'orange',
           			color: '#fff',
                    // height: '25px'
           		}}>{this.state.sortName}</PanelHeader>
           		<PanelBody className="product-block">
           	    {
                     	goodsData.map((goodData, i) => {
                     		return (
                                <Item key={i} goodData={goodData} storeId={this.props.params.storeId} />
                     		);
                     	})
                     }
           		</PanelBody>
		    </Panel>
		);
	}
}
export default connectSort(SortProduct)